<!DOCTYPE html>
<html>
<head>
<title>Math Dash - timed multiplication table practice</title>
<link rel="stylesheet" type="text/css"
	href="static/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="static/css/mathdash.css">
</head>

<body>

	<div class="container">

		<div class="row mathdash-control">
			<div class="span1 play" id="start"></div>
			<div class="span1 stop" id="stop"></div>
			<div class="span1"><span class="nodisplay" id="paused">(paused)</span></div>
		</div>

		<div id="action" class="row mathdash-action">
			<div class="span4">
				<span id="question"></span><span> = </span> 
				<input id="answer" type="text" />
			</div>
			<div class="span1"><div class="mathdash-status"></div></div>
		</div>

		<div class="row mathdash-info">
			<div class="span">
				<p>points</p>
				<p><span id="score" class="bigger">0</p></span>
			</div>
			<div class="span4">
				<span id="mathdash-running" class="nodisplay">
				<p>seconds remaining</p>
				<p id="time_left" class="bigger">120</p></span>
				<span id="mathdash-goodwork" class="nodisplay">Well done! </span>
				<span id="mathdash-gaveup" class="nodisplay">Giving up already? </span>
				<span id="mathdash-results">You answered <span id="questions_total"></span> questions 
				in <span id="time_spent"></span> seconds and got <span id="questions_correct"></span> right.</span>
			</div>
			<div class="span1" id="mathdash-emoticon"></div>
		</div>
		
	</div>
	
	
	<script
		src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"
		type="text/javascript"></script>
	<script
		src="//ajax.googleapis.com/ajax/libs/jqueryui/1.8.23/jquery-ui.min.js"></script>
	<script src="static/js/two_factor_multiplication.js"
		type="text/javascript"></script>
	<script src="static/js/mathdash.js" type="text/javascript"></script>
</body>
</html>
